<template>
  <div class="top" id="userLayout" :class="['user-layout-wrapper', device]">
<!--    <div class="container">-->
<!--      <div class="top">-->
<!--        <div class="header">-->
<!--          <a href="/">-->
<!--            <img src="~@/assets/logo.png" class="logo logoq2" alt="logo">-->
<!--            <span class="title">勤税宝客户端</span>-->
<!--          </a>-->
<!--        </div>-->
<!--        <div class="desc">-->

<!--        </div>-->
<!--      </div>-->

      <route-view></route-view>
<!--    </div>-->
  </div>
</template>

<script>
  import RouteView from "@/components/layouts/RouteView"
  import { mixinDevice } from '@/utils/mixin.js'

  export default {
    name: "UserLayout",
    components: { RouteView },
    mixins: [mixinDevice],
    data () {
      return {}
    },
    mounted () {
      document.body.classList.add('userLayout')
    },
    beforeDestroy () {
      document.body.classList.remove('userLayout')
    },
  }
</script>

<style lang="less" scoped>
.top {
  width: 100%;
  height: 100%;
}
</style>

<!--<style lang="less" scoped>-->
<!--  #userLayout.user-layout-wrapper {-->
<!--    height: 100%;-->

<!--    .container {-->
<!--      width: 100%;-->
<!--      min-height: 100%;-->
<!--      background: #f0f2f5 url(~@/assets/background.svg) no-repeat 50%;-->
<!--      background-size: 100%;-->
<!--      padding: 50px 0 144px;-->
<!--      position: relative;-->

<!--      a {-->
<!--        text-decoration: none;-->
<!--      }-->

<!--      .top {-->
<!--        text-align: center;-->

<!--        .header {-->
<!--          height: 44px;-->
<!--          line-height: 44px;-->

<!--          .badge {-->
<!--            position: absolute;-->
<!--            display: inline-block;-->
<!--            line-height: 1;-->
<!--            vertical-align: middle;-->
<!--            margin-left: -12px;-->
<!--            margin-top: -10px;-->
<!--            opacity: 0.8;-->
<!--          }-->

<!--          .logo {-->
<!--            height: 44px;-->
<!--            vertical-align: top;-->
<!--            margin-right: 16px;-->
<!--            border-style: none;-->
<!--          }-->

<!--          .title {-->
<!--            font-size: 33px;-->
<!--            color: rgba(0, 0, 0, .85);-->
<!--            font-family: "Chinese Quote", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";-->
<!--            font-weight: 600;-->
<!--            position: relative;-->
<!--            top: 2px;-->
<!--          }-->
<!--        }-->
<!--        .desc {-->
<!--          font-size: 14px;-->
<!--          color: rgba(0, 0, 0, 0.45);-->
<!--          margin-top: 12px;-->
<!--          margin-bottom: 40px;-->
<!--        }-->
<!--      }-->
<!--      .footer {-->
<!--        position: absolute;-->
<!--        width: 100%;-->
<!--        bottom: 0;-->
<!--        padding: 0 16px;-->
<!--        margin: 48px 0 24px;-->
<!--        text-align: center;-->

<!--        .links {-->
<!--          margin-bottom: 8px;-->
<!--          font-size: 14px;-->
<!--          a {-->
<!--            color: rgba(0, 0, 0, 0.45);-->
<!--            transition: all 0.3s;-->
<!--            &:not(:last-child) {-->
<!--              margin-right: 40px;-->
<!--            }-->
<!--          }-->
<!--        }-->
<!--        .copyright {-->
<!--          color: rgba(0, 0, 0, 0.45);-->
<!--          font-size: 14px;-->
<!--        }-->
<!--      }-->
<!--    }-->
<!--  }-->
<!--</style>-->
